<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Upload IPA</title>
    <script>
        async function uploadFile() {
            const fileInput = document.getElementById("file");
            const progressBar = document.getElementById("progressBar");
            const progressText = document.getElementById("progressText");

            if (!fileInput.files[0]) {
                alert("Please select a file!");
                return;
            }

            const file = fileInput.files[0];
            const formData = new FormData();
            formData.append("file", file);

            const xhr = new XMLHttpRequest();
            xhr.open("POST", "/upload", true);

            // Update progress bar
            xhr.upload.onprogress = function (event) {
                if (event.lengthComputable) {
                    const percentComplete = Math.round((event.loaded / event.total) * 100);
                    progressBar.value = percentComplete;
                    progressText.innerText = `${percentComplete}% uploaded`;
                }
            };

            // Handle success response
            xhr.onload = function () {
                if (xhr.status === 200) {
                    const response = JSON.parse(xhr.responseText);
                    alert(response.message);
                    const downloadLink = document.getElementById("downloadLink");
                    downloadLink.href = response.redirect_url;
                    downloadLink.style.display = "block";
                } else {
                    alert(`Upload failed: ${xhr.responseText}`);
                }
            };

            xhr.send(formData);
        }
    </script>
</head>
<body>
    <h1>Upload Your IPA</h1>
    <input type="file" id="file" accept=".ipa">
    <button onclick="uploadFile()">Upload</button>

    <progress id="progressBar" value="0" max="100" style="width: 100%;"></progress>
    <p id="progressText"></p>

    <a id="downloadLink" style="display: none;" href="#">Go to Download Page</a>
</body>
</html>
